<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="jquery.js"></script>
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0,user-scalable=no,minimal-ui">
		<link type="text/css" href="css/base.css" rel="stylesheet" />
		<style>
			.zhuce1-box{
				width: 100%;
				height:700px;
				background-image: url(images/zhucebeijin.jpg);
				background-size: 100% 100%;
			}
			.zhuce1-box .header{
				width: 100%;
				min-height: 1.5rem;
				padding-left: .5rem;
				padding-top: .5rem;
				box-sizing: border-box;
			}
			.zhuce1-box .header .pic{
				width: 20%;
				min-height: 1.5rem;
			}
			.zhuce1-box .header .pic img{
				width: 60%;
			}
			.zhuce1-box .icon{
				text-align: center;
				width: 100%;
				padding-top: 3rem;
			}
			.zhuce1-box .denglu{
				width: 100%;
				padding-top: 2rem;
			}
			.zhuce1-box .denglu .user{
				width: 80%;
				min-height: 1rem;
				margin: 0 auto;
				border-radius: 0px;
			}
			.zhuce1-box .denglu .user .pic{
				width: 24%;
				min-height: 1rem;
				/*background-color: red;*/
				text-align: center;
			}
			.zhuce1-box .denglu .user .pic .border img{
				width: 50%;
				margin-top: .4rem;
			}
			.zhuce1-box .denglu .user .txt1{
				width: 70%;
				min-height: 1rem;
				/*	background-color: green;*/
				text-align: center;
				position: relative;
			}
			.zhuce1-box .denglu .user .txt1 input{
				min-height: 3rem;
				outline: none;
				border: none;
				font-size: 1.1rem;
				background: rgba(0,0,0,0);
				color: #ffffff;
			}
			.zhuce1-box .denglu .user .txt1 .pic{
				width: 30%;
				display: none;
			}
			.zhuce1-box .denglu .user .txt1 .pic img{
				margin-top: 1rem;
			}
			/*.zhuce-box .denglu .user .txt1 span{
                width: 1.5rem;
                height: 1.5rem;
                background: url(../images/cha-logo.png) no-repeat;
                position: absolute;
                top: .6rem;
                right: 1rem;
                z-index: 1;
                display: none;
            }*/
			::placeholder{
				font-size:12px;
				color:rgba(255,255,255,.5);
			}
			.zhuce1-box .denglu .yzma{
				width: 80%;
				min-height: 3rem;
				margin-top: 0.5rem;
				margin-right: auto;
				margin-left: auto;
				border-radius: 0px;
			}
			.zhuce1-box .denglu .yzma .pic{
				width: 19%;
				min-height: 3rem;
				text-align: center;
			}
			.zhuce1-box .denglu .yzma .pic .border img{
				width: 50%;
				padding-top:20px;
			}
			.zhuce1-box .denglu .yzma .txt1{
				width: 70%;
				min-height: 3rem;
			}
			.zhuce1-box .denglu .yzma .txt1 input{
				color: #ffffff;
				width:100px;
				outline: none;
				border: none;
				font-size: 1.1rem;
				height:3rem;
				min-height: 3rem;
				background: rgba(0,0,0,0);
				float: left;
			}
			.zhuce1-box .denglu .yzma .txt1 .baomi{
				width: 45%;
				padding-left: rem;
				/*	display: none;*/
			}
			#yanzhengmaBtn{
				margin-top:10px;
				height:1.8rem;
				min-height: 1.8rem;
				display: inline;
				font-size:14px;
				color: #ffffff;
				background:rgba(255,255,255,0);
				border-radius: 50px;
			}
			.zhuce1-box .denglu .yzma .txt1 .daojishi{
				width: 34%;
				background-color: red;
				min-height: 3rem;
				/*	display: none;*/
			}
			.zhuce1-box .denglu #submitBtn{
				display:block;
				width: 80%;
				min-height: 3rem;
				background-color: #f57a89;
				margin: 0px auto;
				border-radius:50px;
				text-align: center;
				margin-top: 1.5rem;
				line-height: 3rem;
				font-size: 1.4rem;
				color: #ffffff;
				border:none;
				text-align: center;
			}
			.zhuce1-box .denglu .tishi{
				width: 80%;
				margin: 0 auto;
				/*min-height: 1.4rem;*/
				/*	background-color: red;*/
				margin-top: .6rem;
				display: none;
			}
			.zhuce1-box .denglu .tishi .box{
				width:75%;
				min-height: 2rem;
				/*	background-color: green;*/
			}
			.zhuce1-box .denglu .tishi .box .pic{
				width: 12%;
			}
			.zhuce1-box .denglu .tishi .box img{
				width: 75%;
			}
			.zhuce1-box .denglu .tishi .box span{
				margin-top: .3rem;
				font-size: .8rem;
			}
			.zhuce1-box .denglu .tishi1{
				width: 80%;
				margin: 0 auto;
				/*min-height: 1.4rem;*/
				/*	background-color: red;*/
				margin-top: .6rem;
				display: none;
			}
			.zhuce1-box .denglu .tishi1 .box{
				width:75%;
				min-height: 2rem;
				/*	background-color: green;*/
			}
			.zhuce1-box .denglu .tishi1 .box .pic{
				width: 12%;
			}
			.zhuce1-box .denglu .tishi1 .box img{
				width: 75%;
			}
			.zhuce1-box .denglu .tishi1 .box span{
				margin-top: .3rem;
				font-size: .8rem;
			}
			.zhuce1-box .denglu .kuang{
				width: 80%;
				min-height: 6rem;
				/*	background-color: red;*/
				margin: 0 auto;
				margin-top: .6rem;
			}
			.zhuce1-box .denglu .kuang{
				width: 80%;
				margin: 0 auto;
				/*min-height: 1.4rem;*/
				/*	background-color: red;*/
				margin-top: .6rem;
				display: none;
			}
			.zhuce1-box .denglu .kuang .box{
				width:80%;
				min-height: 2rem;
				/*	background-color: green;*/
			}
			.zhuce1-box .denglu .kuang .box .pic{
				width: 12%;
			}
			.zhuce1-box .denglu .kuang .box img{
				width: 75%;
			}
			.zhuce1-box .denglu .kuang .box span{
				margin-top: .2rem;
				font-size: .7rem;
			}
			.header{
				height:30px;
			}
			.zuojiantou{
				position:absolute;
				left:5%;
				top:3%;
				z-index: 9999;
			}
			.zuojiantou img{
				transform: scale(0.8);
			}
			.tpu{
				position:absolute;
				left:26%;
				top:6%;
			}
			.user,.yzma{
				padding-bottom:6px;
				border-bottom:1px solid #adadad;
			}
			.user .pic{
				width:120px;
			}
			.pic img{
				transform: scale(.7);
			}
			.user .pic span{
				font-size:16px;
				padding-top:12px;
				padding-left:4px;
				color: #ffffff;
			}
			.yzma .pic img{
				display:block;
				padding-top:10px;
			}
			.xieyi{
				margin-top:15px;
				margin-left:12%;
			}
			input[type=checkbox]{
				border:none;
				width:12px;
				height:12px;
				border-radius: 50%;
				background: white;
			}
			.xieyi a{
				font-size:14px;
				color:white;
			}
		</style>
	</head>
	<body>
		<div class="zhuce1-box">
			<div class="header">
				<div class="zuojiantou"><a href="denlu.html"><img src="images/zuojiantou.png"/></a></div>
				<div class="tpu"><img src="http://www.gracingbra.com/upload/201608/1472202998.png"/></div>
			</div>
			<div class="icon">
				<img src="" />
			</div>
			<form id="regform">
			<div class="denglu">
				<div class="user clearfix">
					<div class="pic fl">
							<div class="fl"><img src="images/shouji.png" /></div>
						    <span onclick="showCountryList()" name="countryNo" id=""countryCode" class="fr">86</span>
					</div>
					<div class="txt1 fr ">
						<input type="text" placeholder="请输入手机号码" id="phone" name="phone" autocomplete="off" class="fl"/>
						<span id="phoneerror"></span>
					</div>
				</div>
				<div class="yzma clearfix">
					<div class="pic fl">
							<img class="fl" src="images/icon_06.png" />
					</div>
					<div class="txt1 fr">
						<input placeholder="请输入验证码" id="yzm"/>
						<span id="yzmerror"></span>
						<div class="baomi fr">
							<input type="button" value="获取验证码" id="yanzhengmaBtn" disabled/><br/><br/>
						</div>
					</div>
				</div>
				<div class="yzma clearfix">
					<div class="pic fl">
						<img class="fl" src="images/mima.png" />
					</div>
					<div class="txt1 fr">
						<input type="password" placeholder="请设置密码" name="pwd" id="pwd1" title="密码长度 6~16 位，数字、字母和符号至少包括两种"/>
						<span id="pwderror1"></span>
					</div>
				</div>
				<div class="yzma clearfix">
					<div class="pic fl">
						<img class="fl" src="images/jie.png" width="32" />
					</div>
					<div class="txt1 fr">
						<input type="password" placeholder="请确认密码" id="pwd2"/>
						<span id="pwderror2"></span>
					</div>
				</div>
				<div class="xieyi"><input type="checkbox" id="agreeCK"/><a href="#"> 注册即表示同意《<span style="color:#F57A89"> 歌瑞森用户协议 </span>》</a></div>
				<input type="button" id="submitBtn" value="注 册" disabled/><br/><br/>
			</div>
			</form>
		</div>
		<script src="reg1.js"></script>
	</body>
</html>